Template Literal Typer: Strengmønstersammenligning og Validering i TypeScript

TypeScript's typesystem er i konstant udvikling og tilbyder udviklere mere kraftfulde værktøjer til at udtrykke kompleks logik og sikre typesikkerhed. En af de mest interessante og alsidige funktioner, der er introduceret i de seneste versioner, er template literal typer. Disse typer giver dig mulighed for at manipulere strenge på typeniveau, hvilket muliggør avanceret strengmønstersammenligning og validering. Dette åbner op for en helt ny verden af muligheder for at skabe mere robuste og vedligeholdelsesvenlige applikationer.

Hvad er Template Literal Typer?

Template literal typer er en form for type, der er konstrueret ved at kombinere streng literal typer og union typer, svarende til hvordan template literals fungerer i JavaScript. Men i stedet for at oprette runtime strenge, opretter de nye typer baseret på eksisterende.

Her er et grundlæggende eksempel:

            type Greeting<T extends string> = `Hello, ${T}!`;

type MyGreeting = Greeting<"World">; // type MyGreeting = "Hello, World!"

            

              
                Copy
              
            
          

I dette eksempel er `Greeting` en template literal type, der tager en strengtype `T` som input og returnerer en ny type, der er sammenkædningen af "Hello, ", `T`, og "!".

Grundlæggende Strengmønstersammenligning

Template literal typer kan bruges til at udføre grundlæggende strengmønstersammenligning. Dette giver dig mulighed for at oprette typer, der kun er gyldige, hvis de matcher et bestemt mønster.

For eksempel kan du oprette en type, der kun accepterer strenge, der starter med "prefix-":

            type PrefixedString<T extends string> = T extends `prefix-${string}` ? T : never;

type ValidPrefixedString = PrefixedString<"prefix-valid">; // type ValidPrefixedString = "prefix-valid"
type InvalidPrefixedString = PrefixedString<"invalid">; // type InvalidPrefixedString = never

            

              
                Copy
              
            
          

I dette eksempel bruger `PrefixedString` en betinget type til at kontrollere, om inputstrengen `T` starter med "prefix-". Hvis den gør det, er typen `T` selv; ellers er det `never`. `never` er en speciel type i TypeScript, der repræsenterer typen af værdier, der aldrig forekommer, hvilket effektivt udelukker den ugyldige streng.

Udtrækning af Dele af en Streng

Template literal typer kan også bruges til at udtrække dele af en streng. Dette er især nyttigt, når du har brug for at parse data fra strenge og konvertere det til forskellige typer.

Lad os sige, at du har en streng, der repræsenterer en koordinat i formatet "x:10,y:20". Du kan bruge template literal typer til at udtrække x- og y-værdierne:

            type CoordinateString = `x:${number},y:${number}`;

type ExtractX<T extends CoordinateString> = T extends `x:${infer X},y:${number}` ? X : never;
type ExtractY<T extends CoordinateString> = T extends `x:${number},y:${infer Y}` ? Y : never;

type XValue = ExtractX<"x:10,y:20">; // type XValue = 10
type YValue = ExtractY<"x:10,y:20">; // type YValue = 20

            

              
                Copy
              
            
          

I dette eksempel bruger `ExtractX` og `ExtractY` nøgleordet `infer` til at fange de dele af strengen, der matcher `number`-typen. `infer` giver dig mulighed for at udtrække en type fra et mønstermatch. De fangede typer bruges derefter som returtypen for den betingede type.

Avanceret Strengvalidering

Template literal typer kan kombineres med andre TypeScript-funktioner, såsom unionstyper og betingede typer, for at udføre avanceret strengvalidering. Dette giver dig mulighed for at oprette typer, der håndhæver komplekse regler for strukturen og indholdet af strenge.

For eksempel kan du oprette en type, der validerer ISO 8601 datostrenge:

            type Year = `${number}${number}${number}${number}`;
type Month = `0${number}` | `10` | `11` | `12`;
type Day = `${0}${number}` | `${1 | 2}${number}` | `30` | `31`;

type ISODate = `${Year}-${Month}-${Day}`;

type ValidDate = ISODate extends "2023-10-27" ? true : false; // true
type InvalidDate = ISODate extends "2023-13-27" ? true : false; // false

function processDate(date: ISODate) {
  // Function logic here.  TypeScript enforces the ISODate format.
  return `Processing date: ${date}`;
}

console.log(processDate("2024-01-15")); // Works
//console.log(processDate("2024-1-15")); // TypeScript error: Argument of type '"2024-1-15"' is not assignable to parameter of type '`${number}${number}${number}${number}-${0}${number}-${0}${number}` | `${number}${number}${number}${number}-${0}${number}-${1}${number}` | ... 14 more ... | `${number}${number}${number}${number}-12-31`'.

            

              
                Copy
              
            
          

Her er `Year`, `Month` og `Day` defineret ved hjælp af template literal typer til at repræsentere de gyldige formater for hver del af datoen. `ISODate` kombinerer derefter disse typer for at oprette en type, der repræsenterer en gyldig ISO 8601 datostreng. Eksemplet demonstrerer også, hvordan denne type kan bruges til at håndhæve dataformatering i en funktion, hvilket forhindrer, at forkerte datoformater sendes. Dette forbedrer kode pålideligheden og forhindrer runtime fejl forårsaget af ugyldig input.

Real-World Use Cases

Template literal typer kan bruges i en række real-world scenarier. Her er et par eksempler:

• Formularvalidering: Du kan bruge template literal typer til at validere formatet af formularinput, såsom e-mailadresser, telefonnumre og postnumre.
• API Request Validering: Du kan bruge template literal typer til at validere strukturen af API request payloads og sikre, at de overholder det forventede format. For eksempel validering af en valutakode (f.eks. "USD", "EUR", "GBP").
• Konfigurationsfilparsing: Du kan bruge template literal typer til at parse konfigurationsfiler og udtrække værdier baseret på specifikke mønstre. Overvej at validere filstier i et konfigurationsobjekt.
• Strengbaserede Enums: Du kan oprette strengbaserede enums med validering ved hjælp af template literal typer.

Eksempel: Validering af Valutakoder

Lad os se på et mere detaljeret eksempel på validering af valutakoder. Vi vil sikre, at kun gyldige ISO 4217 valutakoder bruges i vores applikation. Disse koder er typisk tre store bogstaver.

            type CurrencyCode = `${Uppercase<string>}${Uppercase<string>}${Uppercase<string>}`;

function formatCurrency(amount: number, currency: CurrencyCode) {
  // Function logic to format currency based on the provided code.
  return `$${amount} ${currency}`;
}

console.log(formatCurrency(100, "USD")); // Works
//console.log(formatCurrency(100, "usd")); // TypeScript error: Argument of type '"usd"' is not assignable to parameter of type '`${Uppercase}${Uppercase}${Uppercase}`'.

//More precise example:
type ValidCurrencyCode = "USD" | "EUR" | "GBP" | "JPY" | "CAD" | "AUD"; // Extend as needed

type StronglyTypedCurrencyCode = ValidCurrencyCode;

function formatCurrencyStronglyTyped(amount: number, currency: StronglyTypedCurrencyCode) {
    return `$${amount} ${currency}`;
}

console.log(formatCurrencyStronglyTyped(100, "EUR")); // Works
//console.log(formatCurrencyStronglyTyped(100, "CNY")); // TypeScript error: Argument of type '"CNY"' is not assignable to parameter of type '"USD" | "EUR" | "GBP" | "JPY" | "CAD" | "AUD"'.

            

              
                Copy
              
            
          

Dette eksempel demonstrerer, hvordan man opretter en `CurrencyCode`-type, der kun accepterer strenge bestående af tre store bogstaver. Det andet, mere stærkt typede eksempel viser, hvordan man kan begrænse dette yderligere til en foruddefineret liste over acceptable valutaer.

Eksempel: Validering af API Endpoint Stier

Et andet use case er validering af API endpoint stier. Du kan definere en type, der repræsenterer en gyldig API endpoint struktur, hvilket sikrer, at anmodninger foretages til de korrekte stier. Dette er især nyttigt i microservices arkitekturer, hvor flere tjenester kan eksponere forskellige API'er.

            type APIServiceName = "users" | "products" | "orders";
type APIEndpointPath = `/${APIServiceName}/${string}`;

function callAPI(path: APIEndpointPath) {
  // API call logic
  console.log(`Calling API: ${path}`);
}

callAPI("/users/123"); // Valid
callAPI("/products/details"); // Valid
//callAPI("/invalid/path"); // TypeScript error

// Even more specific:
type APIAction = "create" | "read" | "update" | "delete";
type APIEndpointPathSpecific = `/${APIServiceName}/${APIAction}`;

function callAPISpecific(path: APIEndpointPathSpecific) {
  // API call logic
  console.log(`Calling specific API: ${path}`);
}

callAPISpecific("/users/create"); // Valid
//callAPISpecific("/users/list"); // TypeScript error

            

              
                Copy
              
            
          

Dette giver dig mulighed for at definere strukturen af API endpoints mere præcist, hvilket forhindrer stavefejl og sikrer konsistens på tværs af din applikation. Dette er et grundlæggende eksempel; mere komplekse mønstre kan oprettes til at validere forespørgselsparametre og andre dele af URL'en.

Fordele ved at Bruge Template Literal Typer

Brug af template literal typer til strengmønstersammenligning og validering giver flere fordele:

• Forbedret Typesikkerhed: Template literal typer giver dig mulighed for at håndhæve strengere typebegrænsninger på strenge, hvilket reducerer risikoen for runtime fejl.
• Forbedret Læsbarhed af Koden: Template literal typer gør din kode mere læsbar ved tydeligt at udtrykke det forventede format af strenge.
• Øget Vedligeholdelsesvenlighed: Template literal typer gør din kode mere vedligeholdelsesvenlig ved at give en enkelt kilde til sandhed for strengvalideringsregler.
• Bedre Udvikleroplevelse: Template literal typer giver bedre autocompletion og fejlmeddelelser, hvilket forbedrer den samlede udvikleroplevelse.

Begrænsninger

Selvom template literal typer er kraftfulde, har de også nogle begrænsninger:

• Kompleksitet: Template literal typer kan blive komplekse, især når man beskæftiger sig med indviklede mønstre. Det er afgørende at afbalancere fordelene ved typesikkerhed med kode vedligeholdelsesvenlighed.
• Ydeevne: Template literal typer kan påvirke kompileringsydeevnen, især i store projekter. Dette skyldes, at TypeScript skal udføre mere kompleks typekontrol.
• Begrænset Understøttelse af Regulære Udtryk: Selvom template literal typer giver mulighed for mønstersammenligning, understøtter de ikke hele spektret af regulære udtryksfunktioner. For meget kompleks strengvalidering kan runtime regulære udtryk stadig være nødvendige sammen med disse typekonstruktioner for korrekt inputrensning.

Best Practices

Her er nogle best practices at huske på, når du bruger template literal typer:

• Start Simpelt: Begynd med simple mønstre og øg gradvist kompleksiteten efter behov.
• Brug Beskrivende Navne: Brug beskrivende navne til dine template literal typer for at forbedre kodens læsbarhed.
• Dokumenter Dine Typer: Dokumenter dine template literal typer for at forklare deres formål og brug.
• Test Grundigt: Test dine template literal typer grundigt for at sikre, at de opfører sig som forventet.
• Overvej Ydeevne: Vær opmærksom på virkningen af template literal typer på kompileringsydeevnen og optimer din kode i overensstemmelse hermed.

Konklusion

Template literal typer er en kraftfuld funktion i TypeScript, der giver dig mulighed for at udføre avanceret strengmanipulation, mønstersammenligning og validering på typeniveau. Ved at bruge template literal typer kan du oprette mere robuste, vedligeholdelsesvenlige og typesikre applikationer. Selvom de har nogle begrænsninger, opvejer fordelene ved at bruge template literal typer ofte ulemperne, hvilket gør dem til et værdifuldt værktøj i enhver TypeScript-udviklers arsenal. Efterhånden som TypeScript-sproget fortsætter med at udvikle sig, vil det være afgørende at forstå og udnytte disse avancerede typefunktioner for at bygge software af høj kvalitet. Husk at afbalancere kompleksitet med læsbarhed og altid prioritere grundig test.